<ion-content>
  <div class="backg">
    <div class="full_loader" *ngIf="loading == 1">
      <div class="text-loading">
        Cargando Restaurant...
        <div class="cont-loading">
          <div class="loader"></div>
        </div>
      </div>
    </div>
  
    <div *ngIf="loading === 0" class="header animated fadeInDown" [style.backgroundImage]="'url(' + background + ')'">
      <div class="headerButtonAndTitle">
        <ion-buttons class="ion-align-items-start">
          <ion-menu-toggle>
            <ion-button>
              <ion-icon name="menu"></ion-icon>
            </ion-button>
          </ion-menu-toggle>
        </ion-buttons>
      </div>
    </div>

    <div class="cont-circle" *ngIf="loading === 0">
      <h3 class="welcome">{{ "Welcome_to_our_restaurant" | translation: language }}</h3>
      <div (click)="OpenMenu()">
        <div>
          <ion-button expand="full">{{ "Restaurant_Menu" | translation: language }}</ion-button>
        </div>
      </div>
      <div (click)="CallWaiter()">
        <div>
          <ion-button expand="full">{{ "Call_the_waiter" | translation: language }}</ion-button>
        </div>
      </div>
      <div (click)="OpenStatusOrder()">
        <div>
          <ion-button expand="full">{{ "Show_order_status" | translation: language }}</ion-button>
        </div>
      </div>
    </div>
  
    <div class="ion-text-center back-wrapper">
      <ion-button class="back" fill="outline" (click)="GoMenu()">{{ "Back" | translation: language }}</ion-button>
    </div>
  </div>

  <div class="yellow__div"></div>
</ion-content>
